
    <style>
        * {
            padding: 0;
            margin: 0;
            font-size: 14px;
        }

        .lyb {
            width: 100%;
            margin: 5px 0;
            border: #DDDDDD 1px solid;
            overflow: hidden;
            display: flex
        }

        .lyb-l {
            background: #e5edf2;
            float: left;
            min-width: 160px;
            flex: 0 0 160px;
        }

        .lyb-r {
            float: left;
            background: white;
            padding: 0 20px;
            box-sizing: border-box;
            flex: 1
        }

        .lyb-lT {
            text-align: center;
            padding: 10px 0;
            font-weight: 800;
            border-bottom: 1px dashed #CDCDCD
        }

        .lyb-lB {
            height: 190px;
            padding: 10px 15px;
            box-sizing: border-box;
            text-align: center
        }

        .lyb-lB img {
            width: 130px;
            height: 128px;
        }

        .lyb-rT {
            padding: 10px 0;
            border-bottom: 1px dashed #CDCDCD
        }

        .lyb-rT img {
            vertical-align: middle;
            margin-right: 5px
        }

        .sf {
            float: right
        }

        .lyb-rB {
            padding: 10px 0;
        }

        .msg-content {margin-top: 50px;}
        .msg li{padding:30px 0;border-bottom: 1px dashed #e5e5e5;}
        .msg span{line-height: 27px;}
        .msg .msg-content{border:1px solid #dedede;padding:20px 10px;}

        .msg-page{text-align: center;margin-top:10px;}
        .msg-page li{float:left;margin-left:2px;}
        .msg-page a,.msg-page span{display: block;padding:0px 10px;line-height: 30px;cursor: pointer;border: 1px solid #C2D5E3;}
        .msg-page .active{color:red;}
        .clearfix:after{
            content: '';
            height:0;
            display: block;
            clear: both;
            overflow: hidden;
        }
    </style>

<div class="msg-content">
    <volist name="msgData" id="vo">
        <div class="lyb">
            <div class="lyb-l">
                <div class="lyb-lT">{$vo.name}</div>
                <div class="lyb-lB">
                    <php>
                        if($vo->avatar){
                        $avatar = '/upload/'.$vo->avatar;
                        }else{
                        $avatar ='__PLUGIN_TMPL__/public/assets/images/default.jpg';
                        }
                    </php>
                    <img src="{$avatar}" alt="">
                </div>
            </div>
            <div class="lyb-r">
                <div class="lyb-rT">
                    <img src="__PLUGIN_TMPL__/public/assets/images/online_member.gif" alt="">
                    <span>发表于 {$vo.createtime}</span>
                    <!--<span class="sf"></span>-->
                </div>
                <div class="lyb-rB">
                    <p>{$vo.msg}</p>
                </div>
            </div>
        </div>
    </volist>

    <div class="msg-page">
        <ul class="clearfix" style="display: inline-block;">
            {$msgData->render()}
        </ul>
    </div>
</div>
